<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/vue.js"></script>
</head>
<!-- 
    条件渲染：
        1. v-if:
            写法：
                (1). v-if='表达式'
                (2). v-else-if='表达式'
                (3). v-else='表达式'
            适用于：切换频率较低的场景
            特点：不展示的 Dom 元素直接被擦除
            注意：v-if 可以和：v-else-if、v-else 一起使用，但要求结构不要能被“打断”

        2. v-show:
            写法：v-show='表达式'
            适用于：切换频率较高的场景
            特点：不展示的 DOM 元素未被移除，仅仅是使用样式隐藏掉

        3. 备注：使用 v-if 时，元素可能无法获取到，而是用 v-show 一定可以获取到
 -->
<body>
    
</body>
<script>
    new Vue({
        el:'#root',
        data:{

        },
    })
</script>
</html>